/*
 * @Description: 全宗表格组件
 * @Author: Rfan
 * @Date: 2022-05-30 14:43:58
 * @LastEditTime: 2022-09-08 14:43:18
 */

import { useMemo, useState } from 'react';
import { Alert } from 'antd';
import classNames from 'classnames/bind';
import { useMetadataInheritContext } from '../contexts/MetadataInheritContext';
import ATLevelNav from '@/components/ATLevelNav';
import InheritListPane from './InheritListPane';

import styles from '../styles/list.module.scss';

const cx = classNames.bind(styles);

const PageContent = () => {
  const { selectFond, setSelectAT, setSelectLevel } = useMetadataInheritContext();
  const [title, setTitle] = useState<string>('');
  const [query, setQuery] = useState({});

  const handleChange = ({ atItem, levelItem }: any) => {
    setSelectAT(atItem);
    setSelectLevel(levelItem);
    setTitle(`${atItem?.atName}-${levelItem?.levelName}`);
    setQuery({
      atType: atItem.atType,
      atCode: atItem.atCode,
      level: levelItem.level
    });
  };

  return (
    <>
      <Alert
        className={cx('tips')}
        description="继承配置：首先指定目标层级的字段，再指定上一级别被继承的字段。如：设定文件级“年度”，继承案卷级“年度”，系统自动获取案卷级“年度”填入文件级“年度”。"
        type="info"
        showIcon
      />
      <div className={cx('sort-container')}>
        {useMemo(
          () => (
            <ATLevelNav activeFond={selectFond?.id} hideHighest onChange={handleChange} />
          ),
          [selectFond]
        )}
        <div className={cx('pane-wrap')}>
          <InheritListPane title={title} data={query} />
        </div>
      </div>
    </>
  );
};

export default PageContent;
